<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>index</title>
</head>

<body class="dpflex">
    <header>
        <div class="swiper">
            <div class="swiper-wrapper">
                <div class="swiper-slide Slide1"></div>
                <div class="swiper-slide Slide2"></div>
                <div class="swiper-slide Slide3"></div>
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
            
            <!-- 如果需要导航按钮 -->
            <!-- <div class="swiper-button-prev"></div> -->
            <!-- <div class="swiper-button-next"></div> -->
            
            <!-- 如果需要滚动条 -->
            <!-- <div class="swiper-scrollbar"></div> -->
        </div>
    </header>
    <main class="flex1">
        <div class="line1 dpflex">
            <div class="ranking">
                <p class="rankingText">今日排名</p>
                <p class="rankingNumber">9</p>
                <div class="rankingImg"></div>
            </div>
            <div class="clockIn">
                <p class="clockInText">累计打卡 <span class="clockInDays">0</span>天</p>
                <p class="clockInBtn">今日打卡</p>
                <div class="clockInImg"></div>
            </div>
        </div>
        <div class="line2 dpflex mt20">
            <div class="gameData">
                <p class="gameDataText">运动数据</p>
            </div>
            <div class="badge">
                <p class="badgeText">累积运动徽章</p>
                <p class="badgeSum dpflex"><span class="badgeSumNum">0</span><span class="badgeSumText">枚</span></p>
                <div class="badgeImg"></div>
            </div>
        </div>
        <div class="line3 mt20">
            <p class="line3Text">课程训练</p>
        </div>
        <div class="line4 mt20">
            <p class="line4Text">户外跑步</p>
        </div>
    </main>
    <!-- <footer>
        
    </footer> -->
    
</body>

</html>